/* eslint-disable no-unused-expressions */
import { Dropdown, Icon, Menu, Tooltip } from 'antd';
import React from 'react';
import ConditionalWrapper from '../ConditionalWrapper';
import IconFont from '../IconFont';

function IconLink({
  icon,
  iconFont,
  iconAfterText = false,
  children,
  onClick,
  disabled = false,
  disabledTooltips = '无法操作',
  moreActions,
  ...restProps
}) {
  function renderContent() {
    if (iconAfterText) {
      return (
        <>
          {children} {icon ? <Icon type={icon} /> : <IconFont type={iconFont} />}
        </>
      );
    }
    return (
      <>
        {icon ? <Icon type={icon} /> : <IconFont type={iconFont} />} {children}
      </>
    );
  }

  const dropdownMenu = moreActions ? (
    <Menu>
      {moreActions.map((action, index) => (
        // eslint-disable-next-line react/no-array-index-key
        <Menu.Item key={index}>{action}</Menu.Item>
      ))}
    </Menu>
  ) : null;

  return (
    <ConditionalWrapper
      condition={disabled}
      wrapper={children => <Tooltip title={disabledTooltips}>{children}</Tooltip>}
    >
      <a
        onClick={e => {
          if (disabled) {
            return;
          }
          onClick && onClick(e);
        }}
        className={disabled ? 'text-disabled' : ''}
        style={{ cursor: disabled ? 'not-allowed' : '' }}
        {...restProps}
      >
        {renderContent()}
      </a>
    </ConditionalWrapper>
  );
}

export default IconLink;
